<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta name="referrer" content="no-referrer" />
		<link rel="stylesheet" type="text/css" href="css/details.css" />
		<link rel="stylesheet" type="text/css" href="css/choose.css" />
		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
		<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
		<!-- 开发环境版本，包含了有帮助的命令行警告 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<script src="js/axios.js" type="text/javascript" charset="utf-8"></script>
		<!-- jquery -->
		<script src="js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
		<!-- jQuery Cookie 插件在线地址用于方便获取cookie的值 -->
		<!-- <script src="https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js"></script> -->
		<script src="js/jquery-cookie.min.js" type="text/javascript" charset="utf-8"></script>
		<title>筛选影视</title>
	</head>
	<body>
		<div id="biBox">
			<!-- 导航栏 -->
			<div id="banner">
				<!-- 网站logon -->
				<div id="logo">
					<img src="img/diylogo1.png">
				</div>
				<!-- 导航栏左边标题 -->
				<div id="title">
					<ul>
						<a href="javascript:void(0);" v-for="(item,index) in navigationBar" @click="changeStyle(index)" :style="index==setIndex?navigationBarStyle:''"
						 v-text="item">首页</a>
					</ul>
				</div>
				<!-- 导航栏右边标题 -->
				<div id="titleRight">
					<select @click="doSelect($event)" v-if='isGetName!="登录"'>
						<option value ="设置" style="display: none;"></option>
						<option value ="个人中心" style="display: none;">个人中心</option>
						<option value ="后台管理">后台管理</option>
						<option value ="退出登录" >退出登录</option>
					</select>
					<a href="login.html" onclick="return false" @click="isLogged($event)" target="_blank" v-text="isGetName" title="登录">登录</a>
				</div>

			</div>
			<div id="main">
				<div id="_title"><strong>选影视</strong></div>
				<!-- 选择影视区域 -->
				<div id="chooseBox">
					<div class="choose">
						<ul>
							<li v-for="(allTags,index) in allTags" :style="index==tagsIndex?liStyle:''">
								<a @click="listStyleOne(index,$event)" href="javascript:void(0)" style="color: white;" v-text="allTags"></a></li>
						</ul>
					</div>
					<div class="choose">
						<ul>
							<li v-for="(allGenres,index) in allGenres" :style="index==genresIndex?liStyle:''">
								<a @click="listStyleTwo(index,$event)" href="javascript:void(0)" style="color: white;" v-text="allGenres"></a></li>
						</ul>
					</div>
					<div class="choose">
						<ul>
							<li v-for="(allCountries,index) in allCountries" :style="index==countriesIndex?liStyle:''">
								<a @click="listStyleThree(index,$event)" href="javascript:void(0)" style="color: white;" v-text="allCountries"></a></li>
						</ul>
					</div>
					<div class="choose">
						<ul>
							<li v-for="(allYear_range,index) in allYear_range" :style="index==year_rangeIndex?liStyle:''">
								<a @click="listStyleFour(index,$event)" href="javascript:void(0)" style="color: white;" v-text="allYear_range"></a></li>
						</ul>
					</div>
				</div>
				<!-- 影视展示列表 -->
				<div id="show-list" v-if="videoArray!=null">
					<div id="show" v-for="video in videoArray">
						<div class="videoplay" @click="play(video.title,video.id)"></div>
						<img :src="video.cover"/><br>
						<strong style="color: yellow;" v-text="video.rate+'分 '">7.0</strong>
						<marquee width="100px" behavior="scroll" scrollamount="6"><span v-text="video.title">流浪地球</span></marquee> 
						<a href="Javascript:void(0)" style="font-size: 12px;color: yellowgreen;" @click="details(video.id,video.title,video.cover)">查看详情</a>
					</div>
					<!-- 点击加载更多 -->
					<div class="more">
						<a href="Javascript:void(0)" style="color: #00AAFF;" @click="loadMore()" v-text="loadTip">点击加载更多</a>
						<a href="#main" style="color: #00AAFF;margin-left: 50px;">点击返回顶部</a>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="js/choose.js"></script>
</html>
